<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <script src="https://unpkg.com/axios/dist/axios.min.js"></script>

</head>

<body>
    <button>axios发送请求</button>


    <script>
        const oBtn = document.querySelector("button")
        oBtn.onclick = async function () {
            try {

                /* axios请求接受一个配置对象
                   axios方法返回一个promise实例，成功的被re接受了，失败进入catch异常处理
                */

                const re = await axios({
                    url: "/user", //
                    method: "get",
                    headers: {},

                    //即将与请求一起发送的url参数
                    params: {
                        userId: "001"
                    },

                    //请求体参数，只适用于post和put
                    data: {},
                    timeout: 10000,
                })
                console.log("re", re.data);
            } catch (e) {
                console.log(e.message);
            }
            /*
            axios成功的值对这个对象属性解析：
            — config：是axios请求的时候传入的配置对象
            — data：后端响应的数据
            — headers:响应体
            — request：底层真正使用的xhr实例对象
            — status：响应状态码
            — statusText：响应状态描述
            */
        }
    </script>

</body>

</html>